<template>
	<view>
		<view class="input"><texe class="phone">15605601068</texe><text class="ma">发送验证码</text></view>
		<input type="number" class="input" placeholder="请输入验证码">
		<view class="input">
			<input type="number"  placeholder="请输入新的手机号">
			<text class="ma">发送验证码</text>
		</view>
		<input type="number" class="mabox" placeholder="请输入验证码">
		<view class="bbb">
			<view class="jd">
				确认更换
			</view>
		</view>
	</view>
</template>

<script>
</script>

<style>
	.mabox{
		height: 100rpx;
		border-bottom: 1px #ECECEC solid;
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding-left: 40rpx;
	}
	.phone{
		font-size: 28rpx;
		font-family: PingFang SC;
		font-weight: bold;
		color: #333333;
		opacity: 1;
	}
	.ma{
		font-size: 28rpx;
		font-family: PingFang SC;
		font-weight: 400;
		color: #F09238;
		opacity: 1;
	}
	.bbb{
		display: flex;
		justify-content: center;
		margin-top: 200rpx;
	}
	.input{
		height: 100rpx;
		padding-left: 40rpx;
		border-bottom: 1px #ECECEC solid;
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding-right: 30rpx;
	}
	.box{
		display: flex;
		align-items: center;
		margin-top: 40rpx;
		width: 540rpx;
		justify-content: space-between;
	}
	.jd{
		width: 240rpx;
		height: 70rpx;
		background: linear-gradient(180deg, #F09238 0%, #EC5F2A 100%);
		opacity: 1;
		border-radius: 12rpx;
		color: #FFFFFF ;
		text-align: center;
		line-height: 70rpx;
	}
</style>
